'use strict';
var shopNav = {
    data:{
        type_id:"1",
        text_nav:[
            {id:"1",text:"最新商品",link:"",link_ty:"",link_tit:"",second_data:[]},
            {id:"2",text:"最热商品",link:"",link_ty:"",link_tit:"",second_data:[]},
            {id:"3",text:"我的订单",link:"",link_ty:"",link_tit:"",second_data:[]}
        ],
        img_nav:{
            color:'#2B2D30',
            special:{
                id:"4",
                text:"",
                link:"",
                link_ty:"",
                link_tit:"",
                image:"",
                image_actived:""
            },
            data:[
                {id:"5",text:"",link:"",link_ty:"",link_tit:"",image:"/modules/store/img/shop_nav/01.png",image_actived:"/modules/store/img/shop_nav/01_on.png"},
                {id:"6",text:"",link:"",link_ty:"",link_tit:"",image:"/modules/store/img/shop_nav/02.png",image_actived:"/modules/store/img/shop_nav/02_on.png"},
                {id:"7",text:"",link:"",link_ty:"",link_tit:"",image:"/modules/store/img/shop_nav/03.png",image_actived:"/modules/store/img/shop_nav/03_on.png"}
            ]
        }
    },
    type_list:[
        {id:"1",text:"微信公众号自定义菜单样式",img:"/modules/store/img/footer-weixin.jpg",max:3,def:'',type:"weixin",second_max:5},
        {id:"2",text:"APP导航模板（图标可配置）",img:"/modules/store/img/footer-app1.jpg",max:5,def:'',type:"app"},
        {id:"3",text:"APP导航模板（图标可配置）",img:"/modules/store/img/footer-app2.jpg",max:4,def:'',type:"app_cart"}
    ],
    index:0,
    current_index:-999,
    current_second_index:-999,

    /* 对外公开方法 */
    //加载用户数据
    loading:function(){
        try{
            var self = this;
            $.ajax({url:shop_nav_url})
                .done(function(data){
                    if(!jQuery.isEmptyObject(data.data)){
                        self.data = data.data;
                        if(self.data.text_nav !== null && self.data.text_nav !== undefined){
                            self.index = 0;
                            $.each(self.data.text_nav,function(i,v){
                                v.id =self.index +=1;
                                if(v.second_data !== null && v.second_data !== undefined){
                                    $.each(v.second_data,function(i2,v2){
                                        v2.id = self.index +=1;
                                    })
                                }
                            });
                        }
                        if(self.data.img_nav !== null && self.data.img_nav !== undefined){
                            self.index = 0;
                            $.each(self.data.img_nav.data,function(i,v){
                                v.id =self.index +=1;
                            })
                        }
                        if(parseInt(self.data.type_id) === 1){
                            self.index = self.data.text_nav.length+1;
                        }else if(parseInt(self.data.type_id) === 2){
                            if(self.data.img_nav.data.length>=6){
                                self.data.img_nav.splice(5,(self.data.img_nav.data.length - 5))
                            }
                            self.index = self.data.img_nav.data.length+1;
                        }else if(parseInt(self.data.type_id) === 3){
                            if(self.data.img_nav.data.length>=5){
                                self.data.img_nav.data.splice(4,(self.data.img_nav.data.length - 4))
                            }
                            self.index = self.data.img_nav.data.length+1;
                        }
                    }
                    /*初始化*/
                    self.init();
                })
                .fail(function(e){
                    console.log('数据异常');
                })
                .always(function(){
                    $('.wx-init-container .page-loading').hide();
                })
            ;
        }catch(e){
            console.log(e);
        }
    },
    init:function(){
        try{
            var self = this,
                navModalFooter = '<button type="button" class="btn btn-primary">确定</button><button type="button" class="btn btn-default" data-dismiss="modal">取消</button>'
            ;
            //模板列表初始化
            $("#shopNavModal .m-hor-md").html(this.get_type_list());
            $("#shopNavModal .modal-footer").html(navModalFooter);
            //初始化模板
            this.get_nav_temp();
            //添加模板列表保存事件
            self.nav_modal_save();

            //修改标题弹框初始化
            titlePopover.init();

            //点击其他区域隐藏
            document.onclick = function (e){
                $(".ui-popover").hide();
                $(".popover-link-wrap").hide();
            };
        }catch(e){
            console.log(e);
        }
    },
    update:function(){
        this.get_nav_temp();
    },
    save:function(){
        return JSON.stringify(this.data)
    },
    html:function(){
        try{
            var self = this,_temp = '';
            var location = window.location;
            var _url = location.pathname+location.search;
            console.log(_url);
            $.ajax({url:shop_nav_url})
                .done(function(data){
                    if(!jQuery.isEmptyObject(data.data)){
                        self.data = data.data;
                        if(parseInt(self.data.type_id) === 1){
                            self.index = self.data.text_nav.length+1;
                            _temp = self.get_weixin_html(self.data.text_nav);
                        }else if(parseInt(self.data.type_id) === 2){
                            if(self.data.img_nav.data.length>=6){
                                self.data.img_nav.splice(5,(self.data.img_nav.data.length - 5))
                            }
                            _temp = self.get_app_current(self.data.img_nav,_url);
                        }else if(parseInt(self.data.type_id) === 3){
                            if(self.data.img_nav.data.length>=5){
                                self.data.img_nav.data.splice(4,(self.data.img_nav.data.length - 4))
                            }
                            _temp = self.get_app_cart_current(self.data.img_nav,_url);
                        }
                    }else{
                        _temp = '';
                    }
                    $("#footer").html(_temp);
                    $("#container .mui-content").addClass('has-footer');
                })
                .fail(function(e){
                    console.log('数据异常');
                })
                .always(function(){
                })
            ;
        }catch(e){
            console.log(e);
        }
    },


    /* 内部方法 */
    /*
    * 模板弹框
    * */
    //保存
    nav_modal_save:function(){
        try{
            var self = this;
            $("#shopNavModal .modal-footer .btn-primary").click(function(e){
                e.stopPropagation();
                var _ty = $("input[name='footer_ty']:checked").val();
                self.data.type_id = _ty+'';
                $('#shopNavModal').modal('hide');
                self.update();
            });
        }catch(e){
            console.log(e);
        }
    },

    /*
    * 添加导航
    * */
    add_nav:function(_type){
        var self = this;
        $(".add-shopnav.js-add-nav").click(function(e){
            e.stopPropagation();
            if(_type === 'weixin'){
                if(self.data.text_nav.length<3){
                    self.index+=1;
                    self.data.text_nav.push({"id":""+self.index+"","text":"标题","link":"","link_ty":"","link_tit":"","second_data":[]});
                    //更新编辑框
                    self.update();
                }
                return false;
            }
            else if(_type === 'app'){
                if(self.data.img_nav.data.length<5){
                    self.index+=1;
                    self.data.img_nav.data.push({"id":""+self.index+"","text":"","link":"","link_ty":"","link_tit":"","image":"","image_actived":""});
                    //更新编辑框
                    self.update();
                }
                return false;
            }
            else if(_type === 'app_cart'){
                if(self.data.img_nav.data.length<4){
                    self.index+=1;
                    self.data.img_nav.data.push({"id":""+self.index+"","text":"","link":"","link_ty":"","link_tit":"","image":"","image_actived":""});
                    //更新编辑框
                    self.update();
                }
                return false;
            }
        });
    },
    /*
    * 添加二级导航
    * */
    add_second_nav:function(_type){
        var self = this;
        $('.edit-sidebar-inner .js-add-second-nav').click(function(e){
            e.stopPropagation();
            if(_type === 'weixin'){
                var _index = $(this).parent().parent().index();
                $.each(self.data.text_nav,function(i,v){
                    if(i === _index){
                        if(v.second_data.length<5){
                            self.index+=1;
                            v.second_data.push({"id":""+self.index+"","text":"标题","link":"","link_ty":"","link_tit":""});
                            self.get_nav_temp();
                        }
                        return false;
                    }
                })
            }
        });
    },
    /*
    * 删除一级导航
    * */
    //删除微信模板导航
    del_nav_weixin:function(){
        var self = this;
        $('.wx-sidebar .js-nav-region .first-nav .delete').click(function(e){
            e.stopPropagation();
            var _index = $(this).parent().parent().parent().index();
            $.each(self.data.text_nav,function(i,v){
                if(i === _index){
                    self.data.text_nav.splice(_index,1);
                    //更新页面
                    self.update();
                    $(".wx-entry-box .footer-nav").html(self.get_weixin(self.data.text_nav));
                    return false;
                }
            });
        });
    },
    del_nav_second_weixin:function(){
      var self = this;
      $('.wx-sidebar .js-second-nav-region .delete').click(function(e){
          e.stopPropagation();
          var _this = $(this),
              _index = _this.parent().parent().parent().index(),
              _first = _this.parents('.second-nav'),
              _first_index = _first.parent().index()
          ;
          self.data.text_nav[_first_index].second_data.splice(_index,1);
          _first.html(self.each_weixin_second(self.data.text_nav[_first_index].second_data));
          self.update_weixin_tit_second();
          self.del_nav_second_weixin();
          self.add_second_nav('weixin');
          $(".wx-entry-box .footer-nav").html(self.get_weixin(self.data.text_nav));
          /*$.each(self.data.text_nav,function(i,v){
              if()
          })*/
      });
    },
    /*
     * 微信导航样式属性
     * */
    update_weixin_tit:function(){
        var self = this;
        $(".edit-sidebar-inner .first-nav .js-edit-title").click(function(e){
            e.stopPropagation();
            var _this = $(this),
                _index = _this.parents('.choice').index()
            ;
            $.each(self.data.text_nav,function(i,v){
                if(i === _index){
                    self.current_index = i;
                    self.current_second_index = -999;
                    $('.ui-popover .js-name-input').val(v.text);
                    $('.ui-popover').css({"top":_this.offset().top+30,"left":_this.offset().left-150}).show();
                    return false;
                }
            });
        });
    },
    update_weixin_tit_second:function(){
        var self = this;
        $(".edit-sidebar-inner .js-second-nav-region .js-edit-title").click(function(e){
            e.stopPropagation();
            var _this = $(this),
                _first = _this.parents('.second-nav'),
                _first_index = _first.parent().index(),
                _index = _this.parent().parent().parent().index()
            ;
            $.each(self.data.text_nav,function(i,v){
                if(i === _first_index){
                    self.current_index = i;
                    $.each(v.second_data,function(i2,v2){
                       if(i2 === _index){
                           self.current_second_index = i2;
                           $('.ui-popover .js-name-input').val(v2.text);
                           $('.ui-popover').css({"top":_this.offset().top+30,"left":_this.offset().left-150}).show();
                           return false;
                       }
                    });
                    return false;
                }
            })
        });
    },
    update_weixin_tit_save:function(){
        var self = this;
        if(parseInt(self.data.type_id) ===1){
            $.each(self.data.text_nav,function(i,v){
                if(self.current_second_index>=0){
                    if(i === self.current_index){
                        $.each(v.second_data,function(i2,v2){
                            if(i2 === self.current_second_index){
                                v2.text = $('.js-name-input').val();
                                $('.ui-popover').hide();
                                self.update();
                                return false;
                            }
                        })
                    }
                }else{
                    if(i === self.current_index){
                        v.text = $('.js-name-input').val();
                        $('.ui-popover').hide();
                        self.update();
                        return false;
                    }
                }
            });
        }
    },
    each_weixin_second:function(_data){
        var _temp = '',_add = '';
        if(_data.length<5){
            _add = '<p class="add-shopnav add-second-shopnav js-add-second-nav" style="display: block;">+ 添加二级导航</p>'
        }
        $.each(_data,function(i,v){
            var _link = '<div class="dropdown hover"><a class="dropdown-toggle js-link-to" href="javascript:;;">选择链接页面</a>'+goodsLink.dropmenu+'</div>';
            if(v.link !== "" && v.link !== null && v.link !== undefined){
                _link = '<div class=" clearfix"><div class="pull-left js-link-to"><a href="'+v.link+'" target="_blank" class="new-window link-to-title">['+v.link_ty+'] '+v.link_tit+'</a></div><div class="dropdown hover pull-right"><a class="dropdown-toggle shopnav-item-action" href="javascript:;">修改</a>'+goodsLink.dropmenu+'</div></div>'
            }
            _temp += '<li class="choice">'+
                '<div class="shopnav-item" data-id="'+v.id+'">'+
                '   <div class="actions"><span class="action delete close-modal" title="删除">×</span></div>'+
                '   <div class="shopnav-item-title"><span class="js-edit-title">'+v.text+'</span></div>'+
                '   <div class="shopnav-item-link">'+
                '       <span class="pull-left shopnav-item-split">|</span>'+
                '       <span class="pull-left">链接：</span>'+
                '       <div class="pull-left">'+_link+'</div>'+
                '   </div>' +
                '</div>'+
                '</li>'
        });
        return '<h4>二级导航</h4><div class="js-second-nav-region"><ul class="choices ui-sortable">'+_temp+'</ul></div>'+_add;
    },
    each_weixin:function(_data){
        var self = this,_temp = '';
        if(_data.length>0)
        {
            $.each(_data,function(i,v){
                var _link = '<div class="dropdown hover"><a class="dropdown-toggle js-link-to" href="javascript:;;">选择链接页面</a>'+goodsLink.dropmenu+'</div>';
                if(v.link !== "" && v.link !== null && v.link !== undefined){
                    _link = '<div class=" clearfix"><div class="pull-left js-link-to"><a href="'+v.link+'" target="_blank" class="new-window link-to-title">['+v.link_ty+'] '+v.link_tit+'</a></div><div class="dropdown hover pull-right"><a class="dropdown-toggle shopnav-item-action" href="javascript:;">修改</a>'+goodsLink.dropmenu+'</div></div>'
                }
                _temp += '<li class="choice">'+
                    '           <div class="first-nav">'+
                    '               <h3>一级导航</h3>'+
                    '               <div class="js-first-nav-item-meta-region">'+
                    '                   <div class="shopnav-item" data-id="'+v.id+'">'+
                    '                       <div class="shopnav-item-title"><span class="js-edit-title">'+v.text+'</span></div>'+
                    '                       <div class="shopnav-item-link">'+
                    '                           <span class="pull-left shopnav-item-split">|</span>'+
                    '                           <span class="pull-left">链接：</span>'+
                    '                           <div class="pull-left">'+_link+'</div>'+
                    '                       </div>'+
                    '                   </div>'+
                    '               </div>'+
                    '               <div class="actions"><span class="action delete close-modal" title="删除">×</span></div>'+
                    '           </div>'+
                    '           <div class="second-nav" data-first-nav-index="'+i+'">'+self.each_weixin_second(v.second_data)+'</div>'+
                    '       </li>';
            })
        }
        return _temp;
    },
    get_weixin:function(_data){
        var _temp = '';
        $.each(_data,function(i,v){
            if(v.second_data.length>0){
                var _second = '';
                $.each(v.second_data,function(i2,v2){
                    _second += '<li><a href="javascript:;">'+v2.text+'</a></li>';
                });
                _temp +='<div class="nav-menu-item"><a class="mainmenu" href="javascript:;"><span class="mainmenu-txt"><i class="arrow-weixin"></i>'+v.text+'</span></a><div class="submenu js-submenu"><span class="arrow before-arrow"></span><span class="arrow after-arrow"></span><div class="js-nav-2nd-region"><ul>'+_second+'</ul></div></div></div>'
            }else{
                _temp +='<div class="nav-menu-item"><a class="mainmenu" href="javascript:;"><span class="mainmenu-txt">'+v.text+'</span></a></div>'
            }
        });
        return '<div class="wx-menu-group has-menu-'+_data.length+'"><div class="nav-menu-special-item"><a href="/" class="home"></a></div><div class="nav-menus-wrap">'+_temp+'</div></div>';
    },
    get_weixin_html:function(_data){
        var _temp = '';
        $.each(_data,function(i,v){
            if(v.second_data.length>0){
                var _second = '';
                $.each(v.second_data,function(i2,v2){
                    _second += '<li><a href="'+v2.link+'">'+v2.text+'</a></li>';
                });
                _temp +='<div class="nav-menu-item"><a class="mainmenu" href="javascript:;"><span class="mainmenu-txt"><i class="arrow-weixin"></i>'+v.text+'</span></a><div class="submenu js-submenu"><span class="arrow before-arrow"></span><span class="arrow after-arrow"></span><div class="js-nav-2nd-region"><ul>'+_second+'</ul></div></div></div>'
            }else{
                _temp +='<div class="nav-menu-item"><a class="mainmenu" href="'+v.link+'"><span class="mainmenu-txt">'+v.text+'</span></a></div>'
            }
        });
        return '<div class="wx-menu-group has-menu-'+_data.length+'"><div class="nav-menu-special-item"><a href="/wap" class="home"></a></div><div class="nav-menus-wrap">'+_temp+'</div></div>';
    },
    get_weixin_edit:function(_data){
        var self = this,
            _temp_add = '<p class="add-shopnav js-add-nav">+ 添加一级导航</p>'
        ;
        if(self.data.text_nav.length === self.type_list[0].max){
            _temp_add = '';
        }
        var _temp = '<div class="edit-shopnav-header clearfix"><span>当前模版：</span><span>微信公众号自定义菜单样式</span><a href="#shopNavModal" class="zent-btn zent-btn-primary pull-right js-select-nav-style" data-toggle="modal">修改模版</a></div>'+
            '<div class="js-nav-region clearfix">'+
            '<ul class="choices ui-sortable">'+self.each_weixin(_data)+'</ul>'+
            '</div>'+_temp_add;
        return _temp;
    },
    /*
    * APP导航样式
    * */
    del_nav_app:function(){
        var self = this;
        $('.wx-sidebar .js-nav-region .app-nav .delete').click(function(e){
            e.stopPropagation();
            var _index = $(this).parent().parent().parent().index();
            $.each(self.data.img_nav.data,function(i,v){
                if(i === _index){
                    self.data.img_nav.data.splice(_index,1);
                    //更新页面
                    self.update();
                    return false;
                }
            });
        });
    },

    get_app:function(_data){
        var _temp = '',_color='';
        if(_data.color !== "" && _data.color !== null && _data.color !== undefined){
            _color = 'style="background-color:'+_data.color+'"';
        }
        if(_data.data === null || _data.data === undefined){
            return '<div class="js-navmenu nav-menu-2 has-menu-0" '+_color+'></div>';
        }else{
            $.each(_data.data,function(i,v){
                var _link = 'javascript:void(0);',_img = '';
                if(v.link !== '' && v.link !== null && v.link !== undefined){
                    _link = v.link;
                }
                if(v.image !== '' && v.image !== null && v.image !== undefined){
                    _img = 'style="background-image:url('+v.image+')"'
                }
                _temp +='<li class="box-flex-1"><a href="javascript:;" '+_img+'></a></li>'
            });
            return '<div class="js-navmenu nav-menu-2 has-menu-'+_data.data.length+'" '+_color+'><ul class="centerflex">'+_temp+'</ul></div>';
        }
    },
    get_app_current:function(_data,_url){
        var _temp = '',_color='';
        if(_data.color !== "" && _data.color !== null && _data.color !== undefined){
            _color = 'style="background-color:'+_data.color+'"';
        }
        if(_data.data === null || _data.data === undefined){
            return '<div class="js-navmenu nav-menu-2 has-menu-0" '+_color+'></div>';
        }else{
            $.each(_data.data,function(i,v){
                var _link = 'javascript:void(0);',_img = '';
                if(v.image !== '' && v.image !== null && v.image !== undefined){
                    _img = 'style="background-image:url('+v.image+');"';
                }
                if(v.link !== '' && v.link !== null && v.link !== undefined){
                    _link = v.link;
                    if(v.link === _url){
                        _img = 'style="background-image:url('+v.image_actived+');"';
                    }
                }
                _temp +='<li class="box-flex-1"><a href="'+_link+'" '+_img+'></a></li>'
            });
            return '<div class="js-navmenu nav-menu-2 has-menu-'+_data.data.length+'" '+_color+'><ul class="centerflex">'+_temp+'</ul></div>';
        }
    },
    get_app_edit:function(_data){
        var _temp = '',_add = '<p class="add-shopnav js-add-nav" style="display: block;">+ 添加导航</p>';
        if(_data !== null && _data !== undefined){
            if(_data.data.length>=5){
                _add = '';
            }
            $.each(_data.data,function(i,v){
                var _img = '',_img_actived = '',_link = '';
                var _link_temp = '<div class="dropdown hover"><a class="dropdown-toggle js-link-to" href="javascript:;;">选择链接页面</a>'+goodsLink.dropmenu+'</div>';
                if(v.image !== '' && v.image !== null && v.image !== undefined){
                    _img = 'background-image:url('+v.image+')'
                }
                if(v.image_actived !== '' && v.image_actived !== null && v.image_actived !== undefined){
                    _img_actived = 'background-image:url('+v.image_actived+')'
                }
                if(v.link !== "" && v.link !== null && v.link !== undefined){
                    _link = v.link;
                    _link_temp = '<div class=" clearfix"><div class="pull-left js-link-to"><a href="'+v.link+'" target="_blank" class="new-window link-to-title">['+v.link_ty+'] '+v.link_tit+'</a></div><div class="dropdown hover pull-right"><a class="dropdown-toggle shopnav-item-action" href="javascript:;">修改</a>'+goodsLink.dropmenu+'</div></div>'
                }
                _temp +='<li class="choice">'+
                    '<div class="app-nav">'+
                    '   <div class="actions"><span class="action delete close-modal" title="删除">×</span></div>'+
                    '   <div class="app-nav-image-group clearfix">'+
                    '       <div class="app-nav-image-normal pull-left">'+
                    '           <p>普通：</p>'+
                    '           <div class="app-nav-image-box" style="background-color:'+_data.color+'">'+
                    '               <div class="app-nav-image" style="'+_img+'"></div>'+
                    '               <a href="javascript:;" class="js-trigger-image">选择</a>'+
                    '           </div>'+
                    '       </div>'+
                    '       <div class="app-nav-image-active-box pull-left">'+
                    '           <p>高亮（可选）：</p>'+
                    '           <div class="app-nav-image-box" style="background-color:'+_data.color+'">'+
                    '               <div class="app-nav-image" style="'+_img_actived+'"></div>'+
                    '               <a href="javascript:;" class="js-trigger-actived-image">选择</a>'+
                    '           </div>'+
                    '       </div>'+
                    '   </div>'+
                    '   <div class="control-group">'+
                    '       <div class="controls" style="margin-left: 0;"><input type="hidden" name="image_url" value="'+_img+'"></div>'+
                    '   </div>'+
                    '   <p class="c-gray">图片尺寸要求：不大于128*100像素，支持PNG格式</p>'+
                    '   <div class="split-line"></div>'+
                    '   <div class="control-group control-group-link">'+
                    '       <label class="control-label">链接：</label>'+
                    '       <div class="controls">'+_link_temp+'<input type="hidden" name="link_url" value="'+_link+'"></div>'+
                    '   </div>'+
                    '</div>'+
                    '</li>'
            })
        }

      return '<div class="edit-shopnav-header clearfix"><span>当前模版：</span><span>APP导航模板（图标可配置）</span><a href="#shopNavModal" class="zent-btn zent-btn-primary pull-right js-select-nav-style" data-toggle="modal">修改模版</a></div><div class="shopnav-background-color"><span>底色：</span><input type="color" name="background_color" class="js-background-color" value="'+_data.color+'"><a href="javascript:;" class="btn js-reset-background-color">重置</a></span></div>' +
          '<div class="js-nav-region clearfix">'+
          '<ul class="choices ui-sortable">'+_temp+'</ul>'+
          '</div>'+_add;
    },
    get_app_cart:function(_data){
        var _temp = '',_color='',_home = 'img/shop_nav/f-gwc-whrite.png',
            _special_link = 'javascript:void(0)'
        ;
        if(_data.color !== "" && _data.color !== null && _data.color !== undefined){
            _color = 'style="background-color:'+_data.color+'"';
        }
        if(_data.data === null || _data.data === undefined){
            return '<div class="s-navmenu nav-menu-3 nav-menu has-menu-0" '+_color+'></div>';
        }else{
            if(_data.special !== '' && _data.special !== null && _data.special !== undefined){
                if(_data.special.image !== '' && _data.special.image !== null && _data.special.image !== undefined){
                    _home = _data.special.image;
                }
                if(_data.special.link !== '' && _data.special.link !== null && _data.special !== undefined){
                    _special_link = _data.special.link;
                }
            }
            if(_data.data !== null && _data.data !== undefined){
                $.each(_data.data,function(i,v){
                    var _link = 'javascript:void(0);',
                        _img = ''
                    ;
                    if(v.link !== '' && v.link !== null && v.link !== undefined){
                        _link = v.link;
                    }
                    if(v.image !== '' && v.image !== null && v.image !== undefined){
                        _img = 'style="background-image:url('+v.image+');"';
                    }
                    _temp +='<li class="nav-item nav-pop-sub-item nav-pop-sub-item-'+_data.data.length+'-'+(i+1)+'"><a href="javascript:;" '+_img+'></a></li>';
                    if((_data.data.length<=2 && i===0) || (_data.data.length>2 && i ===1)){
                        _temp +='<li class="nav-special-item nav-item"><div class="home-icon-box"><a href="javascript:;" style="border-color:'+_data.color+';background-image:url('+_home+')"></a></div></li>'
                    }
                })
            }else{
                _temp ='<li class="nav-special-item nav-item"><div class="home-icon-box"><a href="javascript:void(0);" style="border-color:'+_data.color+';background-image:url('+_home+')"></a></div></li>'
            }
            return '<div class="js-navmenu nav-menu-3 nav-menu has-menu-'+_data.data.length+'" '+_color+'>'+
                '<ul class="centerflex nav-pop-sub">'+_temp+'</ul>'+
                '</div>';
        }
    },
    get_app_cart_current:function(_data,_url){
        var _temp = '',_color='',_home = 'img/shop_nav/f-gwc-whrite.png',
            _special_link = 'javascript:void(0)'
        ;
        if(_data.color !== "" && _data.color !== null && _data.color !== undefined){
            _color = 'style="background-color:'+_data.color+'"';
        }
        if(_data.data === null || _data.data === undefined){
            return '<div class="s-navmenu nav-menu-3 nav-menu has-menu-0" '+_color+'></div>';
        }else{
            if(_data.special !== '' && _data.special !== null && _data.special !== undefined){
                if(_data.special.image !== '' && _data.special.image !== null && _data.special.image !== undefined){
                    _home = _data.special.image;
                }
                if(_data.special.link !== '' && _data.special.link !== null && _data.special !== undefined){
                    _special_link = _data.special.link;
                }
            }
            if(_data.data !== null && _data.data !== undefined){
                $.each(_data.data,function(i,v){
                    var _link = 'javascript:void(0);',
                        _img = ''
                    ;
                    if(v.image !== '' && v.image !== null && v.image !== undefined){
                        _img = 'style="background-image:url('+v.image+');"';
                    }
                    if(v.link !== '' && v.link !== null && v.link !== undefined){
                        _link = v.link;
                        if(v.link === _url){
                            _img = 'style="background-image:url('+v.image_actived+');"';
                        }
                    }
                    _temp +='<li class="nav-item nav-pop-sub-item nav-pop-sub-item-'+_data.data.length+'-'+(i+1)+'"><a href="'+_link+'" '+_img+'></a></li>';
                    if((_data.data.length<=2 && i===0) || (_data.data.length>2 && i ===1)){
                        _temp +='<li class="nav-special-item nav-item"><div class="home-icon-box"><a href="'+_special_link+'" style="border-color:'+_data.color+';background-image:url('+_home+')"></a></div></li>'
                    }
                })
            }else{
                _temp ='<li class="nav-special-item nav-item"><div class="home-icon-box"><a href="javascript:void(0);" style="border-color:'+_data.color+';background-image:url('+_home+')"></a></div></li>'
            }
            return '<div class="js-navmenu nav-menu-3 nav-menu has-menu-'+_data.data.length+'" '+_color+'>'+
                '<ul class="centerflex nav-pop-sub">'+_temp+'</ul>'+
                '</div>';
        }
    },
    get_app_cart_edit:function(_data){
        var _temp = '',_add = '<p class="add-shopnav js-add-nav" style="display: block;">+ 添加导航</p>',
            _special_temp = ''
        ;
        if(_data !== null && _data !== undefined){
            if(_data.data.length>=4){
                _add = '';
            }
            if(_data.special !== '' && _data.special !== null && _data.special !== undefined){
                var _img = 'background-image:url(img/shop_nav/f-gwc-whrite.png)',_img_actived = '',_link = '';
                var _link_temp = '<div class="dropdown hover"><a class="dropdown-toggle js-link-to" href="javascript:;;">选择链接页面</a>'+goodsLink.dropmenu+'</div>';
                if(_data.special.image !== '' && _data.special.image !== null && _data.special.image !== undefined){
                    _img = 'background-image:url('+_data.special.image+')'
                }
                if(_data.special.image_actived !== '' && _data.special.image_actived !== null && _data.special.image_actived !== undefined){
                    _img_actived = 'background-image:url('+_data.special.image_actived+')'
                }
                if(_data.special.link !== "" && _data.special.link !== null && _data.special.link !== undefined){
                    _link = _data.special.link;
                    _link_temp = '<div class=" clearfix"><div class="pull-left js-link-to"><a href="'+_data.special.link+'" target="_blank" class="new-window link-to-title">['+_data.special.link_ty+'] '+_data.special.link_tit+'</a></div><div class="dropdown hover pull-right"><a class="dropdown-toggle shopnav-item-action" href="javascript:;">修改</a>'+goodsLink.dropmenu+'</div></div>'
                }
                _special_temp ='<li class="choice">'+
                    '<div class="app-nav">'+
                    '   <div class="app-nav-image-group clearfix">'+
                    '       <div class="app-nav-image-normal pull-left">'+
                    '           <p>普通：</p>'+
                    '           <div class="app-nav-image-box" style="background-color:'+_data.color+'">'+
                    '               <div class="app-nav-image" style="'+_img+'"></div>'+
                    '               <a href="javascript:;" class="js-trigger-image">选择</a>'+
                    '           </div>'+
                    '       </div>'+
                    '       <div class="app-nav-image-active-box pull-left">'+
                    '           <p>高亮（可选）：</p>'+
                    '           <div class="app-nav-image-box" style="background-color:'+_data.color+'">'+
                    '               <div class="app-nav-image" style="'+_img_actived+'"></div>'+
                    '               <a href="javascript:;" class="js-trigger-actived-image">选择</a>'+
                    '           </div>'+
                    '       </div>'+
                    '   </div>' +
                    '   <div class="control-group">'+
                    '       <div class="controls" style="margin-left: 0;"><input type="hidden" name="image_url" value="'+_img+'"></div>'+
                    '   </div>'+
                    '   <p class="c-gray">图片尺寸要求：不大于128*100像素，支持PNG格式</p>'+
                    '   <div class="split-line"></div>'+
                    '   <div class="control-group control-group-link">'+
                    '       <label class="control-label">链接：</label>'+
                    '       <div class="controls">'+_link_temp+'<input type="hidden" name="link_url" value="'+_link+'"></div>'+
                    '   </div>'+
                    '</div>'+
                    '</li>'
            }
            $.each(_data.data,function(i,v){
                var _img = '',_img_actived = '',_link = '';
                var _link_temp = '<div class="dropdown hover"><a class="dropdown-toggle js-link-to" href="javascript:;;">选择链接页面</a>'+goodsLink.dropmenu+'</div>';
                if(v.image !== '' && v.image !== null && v.image !== undefined){
                    _img = 'background-image:url('+v.image+')'
                }
                if(v.image_actived !== '' && v.image_actived !== null && v.image_actived !== undefined){
                    _img_actived = 'background-image:url('+v.image_actived+')'
                }
                if(v.link !== "" && v.link !== null && v.link !== undefined){
                    _link = v.link;
                    _link_temp = '<div class=" clearfix"><div class="pull-left js-link-to"><a href="'+v.link+'" target="_blank" class="new-window link-to-title">['+v.link_ty+'] '+v.link_tit+'</a></div><div class="dropdown hover pull-right"><a class="dropdown-toggle shopnav-item-action" href="javascript:;">修改</a>'+goodsLink.dropmenu+'</div></div>'
                }
                _temp +='<li class="choice">'+
                    '<div class="app-nav">'+
                    '   <div class="actions"><span class="action delete close-modal" title="删除">×</span></div>'+
                    '   <div class="app-nav-image-group clearfix">'+
                    '       <div class="app-nav-image-normal pull-left">'+
                    '           <p>普通：</p>'+
                    '           <div class="app-nav-image-box" style="background-color:'+_data.color+'">'+
                    '               <div class="app-nav-image" style="'+_img+'"></div>'+
                    '               <a href="javascript:;" class="js-trigger-image">选择</a>'+
                    '           </div>'+
                    '       </div>'+
                    '       <div class="app-nav-image-active-box pull-left">'+
                    '           <p>高亮（可选）：</p>'+
                    '           <div class="app-nav-image-box" style="background-color:'+_data.color+'">'+
                    '               <div class="app-nav-image" style="'+_img_actived+'"></div>'+
                    '               <a href="javascript:;" class="js-trigger-actived-image">选择</a>'+
                    '           </div>'+
                    '       </div>'+
                    '   </div>'+
                    '   <div class="control-group">'+
                    '       <div class="controls" style="margin-left: 0;"><input type="hidden" name="image_url" value="'+_img+'"></div>'+
                    '   </div>'+
                    '   <p class="c-gray">图片尺寸要求：不大于128*100像素，支持PNG格式</p>'+
                    '   <div class="split-line"></div>'+
                    '   <div class="control-group control-group-link">'+
                    '       <label class="control-label">链接：</label>'+
                    '       <div class="controls">'+_link_temp+'<input type="hidden" name="link_url" value="'+_link+'"></div>'+
                    '   </div>'+
                    '</div>'+
                    '</li>'
            })
        }

        return '<div class="edit-shopnav-header clearfix"><span>当前模版：</span><span>APP导航模板（图标可配置）</span><a href="#shopNavModal" class="zent-btn zent-btn-primary pull-right js-select-nav-style" data-toggle="modal">修改模版</a></div><div class="shopnav-background-color"><span>底色：</span><input type="color" name="background_color" class="js-background-color" value="'+_data.color+'"><a href="javascript:;" class="btn js-reset-background-color">重置</a></span></div>' +
            '<p class="shop-nav-class">添加中间主图标</p>' +
            '<div class="js-main-icon-setting main-icon-setting clearfix">'+
            '<ul class="choices ui-sortable">'+_special_temp+'</ul>'+
            '</div>' +
            '<p class="shop-nav-class">添加两侧图标</p><p class="shop-nav-icon-tips">此导航模版建议你用两个或者四个自定义图标效果图最佳哦！</p>' +
            '<div class="js-nav-region clearfix">'+
            '<ul class="choices ui-sortable">'+_temp+'</ul>'+
            '</div>' +
            ''+_add;
    },
    /*
     * 选择图库
     * 普通
     * */
    get_image_app:function(){
        var self = this;
        $('.edit-shopnav .js-nav-region .js-trigger-image').click(function(e){
            e.stopPropagation();
            imagesLoad.init(self.callback_get_img_app,$(this));
        });
    },
    get_image_actived_app:function(){
        var self = this;
        $('.edit-shopnav .js-nav-region .js-trigger-actived-image').click(function(e){
            e.stopPropagation();
            imagesLoad.init(self.callback_get_img_actived_app,$(this));
        });
    },
    get_image_app_cart_m:function(){
        var self = this;
        $('.edit-shopnav .js-main-icon-setting .js-trigger-image').click(function(e){
            e.stopPropagation();
            imagesLoad.init(self.callback_get_img_app_cart_m,$(this));
        });
    },
    get_image_actived_app_cart_m:function(){
        var self = this;
        $('.edit-shopnav .js-main-icon-setting .js-trigger-actived-image').click(function(e){
            e.stopPropagation();
            imagesLoad.init(self.callback_get_img_actived_app_cart_m,$(this));
        });
    },
    /*
    * 设置底色
    * */
    get_app_color:function(){
        var self = this,_temp = '';
        $('.edit-shopnav .js-background-color').change(function (e){
            e.stopPropagation();
            self.data.img_nav.color = $(this).val();
            _temp = self.get_app(self.data.img_nav);
            $(".wx-entry-box .footer-nav").html(_temp);
        });
    },
    get_app_color_reset:function(){
      var self = this;
        $('.edit-shopnav .js-reset-background-color').click(function (e){
            e.stopPropagation();
            self.data.img_nav.color ="#ffffff";
            $('.edit-shopnav .js-background-color').val('#ffffff');
            $(".wx-entry-box .footer-nav").html(self.get_app(self.data.img_nav));
        });
    },
    get_app_cart_color:function(){
        var self = this,_temp = '';
        $('.edit-shopnav .js-background-color').change(function (e){
            e.stopPropagation();
            self.data.img_nav.color = $(this).val();
            _temp = self.get_app_cart(self.data.img_nav);
            $(".wx-entry-box .footer-nav").html(_temp);
        });
    },
    get_app_cart_color_reset:function(){
        var self = this;
        $('.edit-shopnav .js-reset-background-color').click(function (e){
            e.stopPropagation();
            self.data.img_nav.color ="#2B2D30";
            $('.edit-shopnav .js-background-color').val('#2B2D30');
            $(".wx-entry-box .footer-nav").html(self.get_app_cart(self.data.img_nav));
        });
    },
    /*
    * 获取选中导航模板的内容，并更新到页面
    * */
    get_nav_temp:function(){
        var self = this,
            _temp = '',
            _temp_edit = ''
        ;
        $.each(self.type_list,function(i,v){
           if(parseInt(self.data.type_id) === parseInt(v.id)){
               if(v.type === 'weixin'){
                   _temp = self.get_weixin(self.data.text_nav);
                   _temp_edit = self.get_weixin_edit(self.data.text_nav);
                   $(".wx-entry-box .footer-nav").html(_temp);
                   $(".edit-shopnav").html(_temp_edit);
                   //添加事件
                   self.add_nav(v.type);
                   self.add_second_nav(v.type);
                   self.del_nav_weixin();
                   self.del_nav_second_weixin();
                   self.update_weixin_tit();
                   self.update_weixin_tit_second();
                   self.click_nav_link();

                   return false;
               }else if(v.type === 'app'){
                   if(self.data.img_nav.data.length>=6){
                       self.data.img_nav.data.splice(5,(self.data.img_nav.data.length - 5))
                   }
                   self.index = self.data.img_nav.data.length+1;
                   _temp = self.get_app(self.data.img_nav);
                   _temp_edit = self.get_app_edit(self.data.img_nav);
                   $(".wx-entry-box .footer-nav").html(_temp);
                   $(".edit-shopnav").html(_temp_edit);
                   //添加事件
                   self.add_nav(v.type);
                   self.get_image_app();
                   self.get_image_actived_app();
                   self.del_nav_app();
                   self.click_nav_link();
                   self.get_app_color();
                   self.get_app_color_reset();

                   return false;
               }else if(v.type === 'app_cart'){
                   if(self.data.img_nav.data.length>=5){
                       self.data.img_nav.data.splice(4,(self.data.img_nav.data.length - 4))
                   }
                   self.index = self.data.img_nav.data.length+1;
                   _temp = self.get_app_cart(self.data.img_nav);
                   _temp_edit = self.get_app_cart_edit(self.data.img_nav);
                   $(".wx-entry-box .footer-nav").html(_temp);
                   $(".edit-shopnav").html(_temp_edit);

                   //添加事件
                   self.add_nav(v.type);
                   self.del_nav_app();
                   self.click_nav_link();
                   self.click_nav_link_m();
                   self.get_image_app_cart_m();
                   self.get_image_actived_app_cart_m();
                   self.get_image_app();
                   self.get_image_actived_app();
                   self.get_app_cart_color();
                   self.get_app_cart_color_reset();
                   return false;
               }
           }
        });
    },

    /*
    * function
    * 获取导航模板分类
    * */
    get_type_list:function(){
        var self = this,
            _str = ''
        ;
        $.each(self.type_list,function(i,v){
            var _check = '';
            if(parseInt(self.data.type_id) === parseInt(v.id)){
                _check = 'checked'
            }
            _str += '<div class="m-b-xs"><label class="radio radio-inline"><input type="radio" name="footer_ty" value="'+v.id+'" '+_check+'><span>'+v.text+'</span></label><div class="footer-img"><img src="'+v.img+'"></div></div>';
        });
        return _str;
    },

    /*
    * 事件
    * 选择链接
    * */
    click_nav_link:function(){
        var self = this;
        $('.js-nav-region .dropdown-menu a').click(function(e){
            goodsLink.click_menu(e,$(this),self.callback_update_link);
        });
    },
    click_nav_link_m:function(){
        var self = this;
        $('.js-main-icon-setting .dropdown-menu a').click(function(e){
            goodsLink.click_menu(e,$(this),self.callback_update_link_m);
        });
    },
    /*
    * 链接回调函数
    * {"link_tit":"链接标题","link_ty":"外链","link_url":""}
    * */
    callback_update_link:function(_this_call){
        try{
            var self = shopNav,
                link_data = goodsLink.data
            ;
            if(parseInt(self.data.type_id) === 1){
                var current_id = _this_call.parents('.shopnav-item').attr('data-id');
                $.each(self.data.text_nav,function(i,v){
                    if(parseInt(v.id) === parseInt(current_id)){
                        v.link = link_data.link_url;
                        v.link_ty = link_data.link_ty;
                        v.link_tit = link_data.link_tit;
                        self.get_nav_temp();
                        return false;
                    }else{
                        $.each(v.second_data,function(i2,v2){
                            if(parseInt(v2.id) === parseInt(current_id)){
                                v2.link = link_data.link_url;
                                v2.link_ty = link_data.link_ty;
                                v2.link_tit = link_data.link_tit;
                                self.get_nav_temp();
                                return false;
                            }
                        })
                    }
                })
            }
            else if(parseInt(self.data.type_id) === 2 || parseInt(self.data.type_id) === 3){
                var _index = _this_call.parents('.choice').index();
                $.each(self.data.img_nav.data,function(i,v){
                    if(parseInt(i) === parseInt(_index)){
                        v.link = link_data.link_url;
                        v.link_ty = link_data.link_ty;
                        v.link_tit = link_data.link_tit;
                        self.get_nav_temp();
                        return false;
                    }
                })
            }
        }catch (e){
            console.log(e);
        }
    },
    callback_update_link_m:function(_this_call){
        try{
            var self = shopNav,
                link_data = goodsLink.data
            ;
            self.data.img_nav.special.link = link_data.link_url;
            self.data.img_nav.special.link_ty = link_data.link_ty;
            self.data.img_nav.special.link_tit = link_data.link_tit;
            self.get_nav_temp();
        }catch (e){
            console.log(e);
        }
    },

    /*
    * 选择图片回调函数
    * */
    callback_get_img_app:function(_data,_this_call){
        try{
            var self = shopNav,_index = _this_call.parents('.choice').index()
            ;
            if(_index <0){
                return false;
            }
            //微信
            if(parseInt(self.data.type_id) === 1){

            }
            // app
            else if(parseInt(self.data.type_id) === 2 || parseInt(self.data.type_id) ===3){
                $.each(self.data.img_nav.data,function(i,v){
                    if(_index === i){
                        v.image = _data;
                        return false;
                    }
                });
                self.update();
            }
        }catch(e){
            console.log(e);
        }
    },
    callback_get_img_actived_app:function(_data,_this_call){
        try{
            var self = shopNav,_index = _this_call.parents('.choice').index()
            ;
            if(_index <0){
                return false;
            }
            //微信
            if(parseInt(self.data.type_id) === 1){

            }
            // app
            else if(parseInt(self.data.type_id) === 2 || parseInt(self.data.type_id) ===3){
                $.each(self.data.img_nav.data,function(i,v){
                    if(_index === i){
                        v.image_actived = _data;
                        return false;
                    }
                });
                self.update();
            }
        }catch(e){
            console.log(e);
        }
    },
    callback_get_img_app_cart_m:function(_data,_this_call){
        try{
            var self = shopNav;
            self.data.img_nav.special.image = _data;
            self.update();
        }catch(e){
            console.log(e);
        }
    },
    callback_get_img_actived_app_cart_m:function(_data,_this_call){
        try{
            var self = shopNav;
            self.data.img_nav.special.image_actived = _data;
            self.update();
        }catch(e){
            console.log(e);
        }
    },
};

var titlePopover = {
    init:function(){
        var _temp = '<span></span><input class="input-medium js-name-input" type="text" value="标题" placeholder="" maxlength="20" style="margin-bottom: 0;"><a href="javascript:;" class="zent-btn zent-btn-primary js-save" style="margin-left: 20px;">确定</a><a href="javascript:;" class="zent-btn js-cancel">取消</a>';
        $('.ui-popover-inner').html(_temp);
        //添加事件
        this.save();
        this.cancel();

        //点击自身阻止向上传递事件
        $('.ui-popover').bind("click", function (e) {
            e = e || event; stopFunc(e);
        });
    },
    save:function(){
        $('.ui-popover .js-save').click(function(e){
            e.stopPropagation();
            shopNav.update_weixin_tit_save();
        });

    },
    cancel:function(){
        $('.ui-popover .js-cancel').click(function(e){
            e.stopPropagation();
            $('.ui-popover').hide();
        });
    }
};

$(function(){
    $("#page-content .panel-body .app-actions .zent-btn-primary").click(function(e){
        e.stopPropagation();
        var validata = true;
        $('.error-message').remove();
        $("input[name='image_url']").each(function(){
            var _this = $(this);
            if(_this.val() === ''){
                validata = false;
                _this.parent().append('<p class="help-block error-message">请选择一张图片</p>');
            }
        });
        $("input[name='link_url']").each(function(){
            var _this = $(this);
            if(_this.val() === ''){
                validata = false;
                _this.parent().append('<p class="help-block error-message">请选择链接地址</p>');
            }
        });
        if(validata){
            var json = shopNav.save();
            sessionStorage.setItem("shop_nav_js",json);
        }
    });
});